<?php slot("head");?>
<link rel="stylesheet" href="/css/bootstrap-image-gallery.css">
<script type="text/javascript" src="/js/bootstrap.js"></script>
<script src="/js/bootstrap-image-gallery.js"></script>
<?php end_slot();?>


<!-- modal-gallery is the modal dialog used for the image gallery -->
<div id="modal-gallery" class="modal modal-gallery hide fade">
    <div class="modal-header">
        <a class="close" data-dismiss="modal">&times;</a>
        <h3 class="modal-title"></h3>
    </div>
    <div class="modal-body"><div class="modal-image"></div></div>
    <div class="modal-footer">
        <a class="btn btn-primary modal-next">Next <i class="icon-arrow-right icon-white"></i></a>
        <a class="btn btn-info modal-prev"><i class="icon-arrow-left icon-white"></i> Previous</a>
        <a class="btn btn-success modal-play modal-slideshow" data-slideshow="5000"><i class="icon-play icon-white"></i> Slideshow</a>
        <a class="btn modal-download" target="_blank"><i class="icon-download"></i> Download</a>
    </div>
</div>





<div id="gallery" data-toggle="modal-gallery" data-target="#modal-gallery">
    <a href="/images/Blue hills.jpg" title="Blue hills" rel="gallery">Blue hills</a>
    <a href="/images/Sunset.jpg" title="Sunset" rel="gallery">Sunset</a>
    <a href="/images/Water lilies.jpg" title="Water lilies" rel="gallery">Water lilies</a>
</div>
